@import 'public.css';
@import 'http://at.alicdn.com/t/font_331719_lph7yv6bixdpldi.css';

.clearfloat:after {
	display: block;
	clear: both;
	content: "";
	visibility: hidden;
	height: 0;
}

.clearfloat {
	zoom: 1;
}
@mixin clearfloat {
	zoom: 1;

	&:after {
		display: block;
		clear: both;
		content: "";
		visibility: hidden;
		height: 0;
	}
}
@mixin ListBackgroundImg {
	background-image: url("../images/right.png");
	background-position: 94% center;
	background-repeat: no-repeat;
	background-size: 15px 33px;
}
@mixin line-clamp ($line) {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	word-break: break-all;
	-webkit-line-clamp: $line;
	-webkit-box-orient: vertical;
}
$themeColor: #ff8484;

div.btnCon {
	width: 100%;
	padding: 30px 30px 100px;

	a.btn,
	span.btn {
		width: 100%;
		height: 85px;
		display: block;
		border-radius: 8px;
		background-color: $themeColor;
		text-align: center;
		line-height: 85px;
		font-size: 30px;
		color: #fff;
	}
}

div#alertCon {
	background-color: rgba(0,0,0,0.3);
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 99;
	padding-top: 300px;
	text-align: center;

	> span {
		display: inline-block;
		line-height: 60px;
		padding: 0 40px;
		color: #fff;
		border-radius: 30px;
		font-size: 30px;
		background-color: $themeColor;
	}
}

div.AddPhotoCon {
	background-color: rgba(0,0,0,0.3);
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 90;
	padding: 10px 40px 40px;

	div.timeLine {
		width: 100%;
		height: 5px;
		background-color: rgba(255,255,255,0.5);
		display: none;

		> span.line {
			display: block;
			width: 0;
			height: 100%;
			transition: all 0.3s;
			background-color: #6bdafd;
		}
	}

	.uploaderCon {
		width: 100%;
	}

	.uploader-list {
		margin-top: 10px;
		width: 100%;
		height: 800px;
		border: 2px solid #fff;
		overflow: hidden;

		> img {
			width: 100%;
		}
	}

	#filePicker {
		margin-top: 30px;
		width: 100%;

		.webuploader-pick {
			display: block;
			width: 100%;
			height: 80px;
			padding: 0;
			line-height: 80px;
			font-size: 30px;
			color: #fff;
			border-radius: 10px;
		}
	}

	div.cloesPhotoCn,
	div.confirm {
		margin-top: 30px;
		text-align: center;
		display: block;
		width: 100%;
		height: 80px;
		padding: 0;
		line-height: 80px;
		font-size: 30px;
		color: #fff;
		border-radius: 10px;
		background-color: $themeColor;
	}

	div.cloesPhotoCn {
		background-color: #505050;
	}
}

#MaxCon {
	width: 750px;
	height: 100%;
	position: relative;
}

#headerCon {
	width: 100%;
	height: 196px;
	background-color: #636363;

	ul.navInd {
		width: 100%;
		height: 100px;
		padding: 12px 20px 0;
		@include clearfloat;

		> li {
			width: 20%;
			height: 100%;
			padding: 0 10px;
			float: left;
			text-align: center;

			> div {
				width: 100%;
				height: 100%;
				border-radius: 8px 8px 0 0;
				padding-top: 24px;

				> span {
					display: inline-block;
					width: 48px;
					height: 48px;
					text-align: center;
					line-height: 50px;
					font-size: 28px;
					color: #fff;
					border-radius: 50%;
				}
			}
		}

		> li.active {
			> div {
				background-color: $themeColor;

				> span {
					background-color: #fff;
					color: $themeColor;
				}
			}
		}
	}

	div.titleCon {
		width: 100%;
		height: 97px;
		background-color: $themeColor;
		text-align: center;
		line-height: 97px;
		font-size: 36px;
		color: #fff;
		position: relative;

		div.info {
			position: absolute;
			bottom: 26px;
			right: 20px;
			line-height: 22px;
			color: #636363;
			font-size: 22px;
		}
	}
}

ul.bankCon {
	width: 100%;
	padding: 30px 30px 30px 0;

	> li {
		margin-top: 30px;
		@include clearfloat;

		div.LCon {
			float: left;
			width: 220px;
			font-size: 28px;
			color: #333333;
			line-height: 80px;
			text-align: right;

			i {
				color: $themeColor;
			}
		}

		div.RCon {
			float: right;
			width: 500px;

			div.inCon {
				width: 100%;
				height: 80px;
			}

			div.hintInfo {
				width: 100%;
				color: $themeColor;
				font-size: 24px;
				padding-top: 10px;
				@include clearfloat;
			}
		}

		input.text {
			width: 100%;
			height: 80px;
			border: 0;
			border-radius: 10px;
			background-color: #f2f2f2;
		}

		input[type='date'] {
			position: relative;

			&:after {
				font-family: 'iconfont';
				content: '\e999';
				position: absolute;
				top: 0;
				right: 40px;
				font-size: 40px;
				color: $themeColor;
				line-height: 80px;
			}
		}

		input.text,
		select.selectOne,
		select.selectTwo {
			font-size: 30px;
			color: #000;
			padding-left: 20px;
		}

		select.selectOne,
		select.selectTwo {
			width: 236px;
			height: 80px;
			border-radius: 10px;
			border: 1px solid #999999;
		}

		select.selectTwo {
			margin-left: 15px;
		}

		div.radioCn {
			width: 160px;
			height: 80px;
			float: left;
			line-height: 80px;
			font-size: 30px;
			color: #333;
			padding-left: 45px;
			position: relative;

			input[type='radio'] {
				visibility: hidden;
			}

			label {
				display: block;
				position: absolute;
				width: 100%;
				height: 100%;
				top: 0;
				left: 0;
				padding-left: 50px;
			}

			label:before {
				content: '';
				cursor: pointer;
				position: absolute;
				width: 40px;
				height: 40px;
				top: 20px;
				left: 0;
				background: #fff;
				border: 2px solid #ccc;
				-moz-border-radius: 3px;
				/* Gecko browsers */
				-webkit-border-radius: 3px;
				/* Webkit browsers */
				border-radius: 50%;
				/* W3C syntax */
			}

			label:after {
				opacity: 0;
				content: '';
				position: absolute;
				width: 36px;
				height: 20px;
				background: transparent;
				top: 15px;
				left: 10px;
				border: 5px solid #ff9898;
				border-top: none;
				border-right: none;
				-webkit-transform: rotate(-45deg);
				-moz-transform: rotate(-45deg);
				-o-transform: rotate(-45deg);
				-ms-transform: rotate(-45deg);
				transform: rotate(-45deg);
			}

			input[type=radio]:checked + label:after {
				opacity: 1;
			}
		}
	}
}

ul.pageTwoCon {
	width: 100%;
	padding: 30px;

	> li {
		width: 100%;
		height: 80px;
		position: relative;
		margin-top: 25px;

		> span.name {
			position: absolute;
			top: 0;
			left: 40px;
			font-size: 30px;
			color: $themeColor;
			line-height: 80px;
			z-index: 9;
		}

		> span.button {
			width: 100%;
			height: 100%;
			display: block;
			border-radius: 8px;
			background-color: #f9b758;
			text-align: center;
			line-height: 80px;
			font-size: 34px;
			color: #fff;
		}

		> input[type='date'] {
			padding-left: 120px;
			width: 100%;
			height: 100%;
			border: 1px solid #999999;
			border-radius: 10px;
			font-size: 30px;
			position: relative;

			&:after {
				font-family: 'iconfont';
				content: '\e999';
				position: absolute;
				top: 0;
				right: 40px;
				font-size: 40px;
				color: $themeColor;
				line-height: 80px;
			}
		}
	}
}

ul.timeList {
	width: 100%;

	> li {
		width: 100%;
		height: 100px;
		line-height: 100px;
		padding: 0 40px;
		font-size: 32px;
		margin-top: 22px;
		background-color: #f2f2f2;
		@include clearfloat;

		> span {
			display: block;
		}

		> span.text {
			float: left;
		}

		> span.but {
			float: right;
			color: $themeColor;

			> i {
				font-size: 40px;
			}
		}
	}
}

div.pageThrreCn {
	padding-top: 50px;
	padding-bottom: 50px;
	background-color: #fff;

	div.title {
		font-size: 38px;
		color: $themeColor;
		line-height: 70px;
		padding: 0 30px;
	}

	div.describe {
		font-size: 24px;
		padding: 0 30px;
	}
}

ul.pageThrrList {
	width: 100%;

	> li {
		width: 100%;
		margin-top: 40px;
		@include clearfloat;

		div.LCon {
			float: left;
			height: 80px;
			line-height: 80px;
			text-align: right;
			font-size: 30px;
			width: 370px;

			i {
				color: $themeColor;
			}
		}

		div.inCn {
			width: 370px;
			font-size: 30px;
			line-height: 80px;

			input[type='text'] {
				width: 150px;
				height: 90px;
				border: 0;
				border-radius: 10px;
				background-color: #f2f2f2;
				margin: 0 6px;
				font-size: 30px;
				padding: 0 10px;
			}
		}

		div.Rcon {
			float: right;
			height: 80px;

			div.radioCn {
				width: 160px;
				height: 80px;
				float: left;
				line-height: 80px;
				font-size: 30px;
				color: #333;
				padding-left: 45px;
				position: relative;

				input[type='radio'] {
					visibility: hidden;
				}

				input[type=radio] {
					visibility: hidden;
				}

				label {
					display: block;
					position: absolute;
					width: 100%;
					height: 100%;
					top: 0;
					left: 0;
					padding-left: 50px;
				}

				label:before {
					content: '';
					cursor: pointer;
					position: absolute;
					width: 40px;
					height: 40px;
					top: 20px;
					left: 0;
					background: #fff;
					border: 2px solid #ccc;
					-moz-border-radius: 3px;
					/* Gecko browsers */
					-webkit-border-radius: 3px;
					/* Webkit browsers */
					border-radius: 50%;
					/* W3C syntax */
				}

				label:after {
					opacity: 0;
					content: '';
					position: absolute;
					width: 36px;
					height: 20px;
					background: transparent;
					top: 15px;
					left: 10px;
					border: 5px solid #ff9898;
					border-top: none;
					border-right: none;
					-webkit-transform: rotate(-45deg);
					-moz-transform: rotate(-45deg);
					-o-transform: rotate(-45deg);
					-ms-transform: rotate(-45deg);
					transform: rotate(-45deg);
				}

				input[type=radio]:checked + label:after {
					opacity: 1;
				}
			}
		}
	}
}

ul.detailedExperience {
	width: 100%;

	> li {
		margin-top: 28px;
		@include clearfloat;

		div.LCon {
			float: left;
			width: 190px;
			text-align: right;
			font-size: 30px;
			line-height: 80px;
		}

		div.RCon {
			width: 550px;
			float: right;
			font-size: 30px;
			padding-right: 40px;

			p.alert {
				font-size: 24px;
				color: $themeColor;
				line-height: 45px;
			}

			textarea.textareaCon {
				width: 100%;
				height: 205px;
				padding: 10px;
				font-size: 30px;
				border: 0;
				border-radius: 10px;
				background-color: #f2f2f2;
			}

			input[type='text'],
			input[type='number'] {
				width: 100%;
				height: 90px;
				border: 0;
				border-radius: 10px;
				background-color: #f2f2f2;
				margin: 0 6px;
				font-size: 30px;
				padding-left: 20px;
			}

			input[type='date'] {
				width: 455px;
				height: 80px;
				border: 1px solid #999999;
				border-radius: 10px;
				font-size: 30px;
				position: relative;
				margin-right: 10px;
				padding-left: 20px;

				&:after {
					font-family: 'iconfont';
					content: '\e999';
					position: absolute;
					top: 0;
					right: 40px;
					font-size: 40px;
					color: $themeColor;
					line-height: 80px;
				}
			}

			div.radioCn {
				width: 160px;
				height: 80px;
				float: left;
				line-height: 80px;
				font-size: 30px;
				color: #333;
				padding-left: 45px;
				position: relative;

				input[type='radio'] {
					visibility: hidden;
				}

				input[type=radio] {
					visibility: hidden;
				}

				label {
					display: block;
					position: absolute;
					width: 100%;
					height: 100%;
					top: 0;
					left: 0;
					padding-left: 50px;
				}

				label:before {
					content: '';
					cursor: pointer;
					position: absolute;
					width: 40px;
					height: 40px;
					top: 20px;
					left: 0;
					background: #fff;
					border: 2px solid #ccc;
					-moz-border-radius: 3px;
					/* Gecko browsers */
					-webkit-border-radius: 3px;
					/* Webkit browsers */
					border-radius: 50%;
					/* W3C syntax */
				}

				label:after {
					opacity: 0;
					content: '';
					position: absolute;
					width: 36px;
					height: 20px;
					background: transparent;
					top: 15px;
					left: 10px;
					border: 5px solid #ff9898;
					border-top: none;
					border-right: none;
					-webkit-transform: rotate(-45deg);
					-moz-transform: rotate(-45deg);
					-o-transform: rotate(-45deg);
					-ms-transform: rotate(-45deg);
					transform: rotate(-45deg);
				}

				input[type=radio]:checked + label:after {
					opacity: 1;
				}
			}
		}

		> span.button {
			width: 100%;
			height: 100%;
			display: block;
			border-radius: 8px;
			background-color: #f9b758;
			text-align: center;
			line-height: 80px;
			font-size: 34px;
			color: #fff;
		}

		ul.photoList {
			width: 100%;
			@include clearfloat;

			> li {
				width: 160px;
				height: 205px;
				border-radius: 10px;
				overflow: hidden;
				float: left;
				margin-right: 20px;

				img {
					width: 100%;
				}
			}

			li.addPhoto {
				text-align: center;
				line-height: 200px;
				border: 2px solid $themeColor;
				color: $themeColor;

				i {
					font-size: 80px;
				}
			}
		}
	}
}

ul.workList {
	width: 100%;
	padding: 30px;
	margin-top: 30px;

	> li {
		background-color: #f2f2f2;
		border-radius: 10px;
		height: 180px;
		margin-top: 30px;
		padding: 40px 30px 0;

		div.head {
			padding-left: 10px;
			border-left: 11px solid $themeColor;
			font-size: 26px;
			line-height: 27px;
			color: $themeColor;
		}

		div.LCn {
			float: left;
			width: 540px;
			padding-top: 17px;

			p {
				font-size: 26px;
				line-height: 38px;
			}
		}

		div.RigCn {
			width: 80px;
			float: right;
			text-align: center;
			height: 80px;

			i {
				font-size: 50px;
				color: $themeColor;
			}
		}
	}
}

div.pageFourCn {
	padding: 30px;

	div.head {
		font-size: 30px;

		i {
			color: $themeColor;
		}
	}

	textarea.textareaCn {
		margin-top: 20px;
		width: 100%;
		border-radius: 10px;
		height: 240px;
		background-color: #f2f2f2;
		padding: 10px;
		font-size: 24px;
		border: 0;
	}

	div.labelCon {
		min-height: 500px;
	}

	span.label {
		display: inline-block;
		padding: 0 28px;
		border-radius: 15px;
		font-size: 24px;
		line-height: 42px;
		color: #fff;
		background-color: $themeColor;
		margin: 15px 10px 0;
	}
}

div.pageFiveCon {
	width: 100%;
	height: 1010px;
	background-image: url("../images/bcak.jpg");
	background-repeat: no-repeat;
	padding-top: 760px;
}

section#login,
section#navCn {
	width: 100%;
	height: 100%;
}

div.loginCon {
	width: 100%;
	height: 100%;
	background-image: url("../images/loginBack.jpg");
	background-size: 100% 1235px;
	background-repeat: no-repeat;
	padding: 340px 60px 0;

	ul.formCn {
		width: 100%;
		width: 100%;
		background-color: rgba(255,255,255,0.4);
		border-radius: 16px;
		padding: 36px;

		> li {
			margin-top: 44px;
			position: relative;

			> input {
				width: 100%;
				height: 80px;
				border-radius: 16px;
				font-size: 26px;
				padding-left: 185px;
				border: 0;
			}

			span.name {
				font-size: 26px;
				display: block;
				width: 150px;
				height: 80px;
				position: absolute;
				top: 0;
				left: 0;
				line-height: 80px;
				padding-left: 40px;
			}

			span.yanzm {
				position: absolute;
				top: 5px;
				right: 0;
				height: 70px;
				border-left: 1px solid #e1e1e1;
				display: block;
				width: 190px;
				text-align: center;
				line-height: 70px;
				font-size: 30px;
				color: $themeColor;
			}

			button {
				width: 100%;
				height: 80px;
				background-color: $themeColor;
				border-radius: 16px;
				color: #fff;
				font-size: 28px;
				border: 0;
			}
		}
	}
}

div.Navcon {
	width: 100%;

	div.heads {
		width: 100%;
		height: 100px;
		text-align: center;
		line-height: 100px;
		font-size: 30px;
		color: #fff;
		position: relative;
		background-color: #fff;

		a.goup {
			width: 100px;
			height: 100px;
			color: #333;
			position: absolute;
			top: 0;
			left: 0;
			display: block;

			i {
				line-height: 100px;
				font-size: 30px;
			}
		}
	}

	div.Onrback {
		background-color: #636363;
	}

	div.Onrback2 {
		background-color: $themeColor;
	}

	header.Message {
		background-image: url("../images/headerBack.jpg");
		height: 225px;
		padding-top: 40px;
		padding-left: 35px;
		margin-top: 20px;
		@include clearfloat;

		div.LCn {
			float: left;
			width: 130px;

			div.LogOut {
				font-size: 24px;
				color: #fff;
				text-align: center;
				padding-top: 10px;
			}
		}

		a.iconCn {
			width: 130px;
			height: 130px;
			border-radius: 50px;
			overflow: hidden;
			display: block;

			> img {
				width: 100%;
				height: 100%;
				border-radius: 50%;
			}
		}

		div.Rn {
			width: 555px;
			float: right;
			color: #fff;

			div.name {
				font-size: 32px;
			}

			div.dist {
				width: 100%;
				font-size: 28px;
				border-bottom: 1px solid #fff;
				line-height: 60px;
				@include clearfloat;

				div.site {
					float: left;
				}

				a.link {
					float: right;
					color: #fff;
					padding-right: 40px;

					i {
						font-size: 28px;
						margin-left: 15px;
					}
				}
			}

			div.srat {
				line-height: 70px;
				@include clearfloat;

				span {
					font-size: 28px;
					margin-right: 20px;

					> i {
						color: #fff;
						font-size: 32px;
						margin: 0 3px;
					}

					> i.active {
						color: #ffc600;
					}
				}

				span.link {
					float: right;
					margin-right: 36px;

					i {
						font-size: 28px;
					}
				}
			}
		}
	}

	ul.list {
		width: 100%;
		padding: 75px;

		> li {
			margin-top: 110px;
			width: 100%;
			height: 148px;
			background-color: $themeColor;
			border-radius: 10px;
			line-height: 148px;
			text-align: center;

			> a {
				display: block;
				width: 100%;
				height: 100%;
				color: #fff;
				font-size: 30px;
			}
		}
	}

	ul.Navlist {
		width: 100%;
		padding-left: 35px;
		background-color: #fff;
		margin-top: 20px;

		> li {
			border-bottom: 1px solid #e1e1e1;

			> a {
				display: block;
				@include clearfloat;

				div.title {
					float: left;
					line-height: 99px;
					@include clearfloat;

					div.iconCn {
						float: left;
						width: 60px;
						height: 99px;
						padding-top: 30px;

						i {
							display: block;
							width: 40px;
							height: 40px;
							border-radius: 50%;
							background-color: $themeColor;
							text-align: center;
							line-height: 40px;
							font-size: 28px;
							color: #fff;
						}
					}

					div.name {
						float: left;
						font-size: 28px;
						color: #666;
					}
				}

				div.Rn {
					float: right;
					line-height: 99px;
					color: #999;
					font-size: 28px;

					.active {
						color: $themeColor;
					}

					i {
						font-size: 28px;
						margin-left: 20px;
						padding-right: 25px;
						color: #dcdcdc;
					}
				}
			}
		}

		> li.time {
			text-align: center;
			line-height: 99px;
			color: #666;
			font-size: 28px;
		}

		div.btn {
			padding: 20px;
			text-align: center;

			> a {
				display: inline-block;
				width: 276px;
				height: 77px;
				border-radius: 15px;
				text-align: center;
				line-height: 77px;
				color: #fff;
				font-size: 28px;
				background-color: $themeColor;
			}
		}
	}
}

div.nextPage {
	padding: 30px;

	> span {
		display: block;
		width: 100%;
		height: 87px;
		background-color: $themeColor;
		font-size: 34px;
		color: #fff;
		text-align: center;
		line-height: 87px;
		border-radius: 10px;
	}
}

section#AddPhoto {
	width: 750px;

	div.headInd,
	div.navHead {
		width: 100%;
		height: 100px;
		color: #fff;
		line-height: 100px;
		text-align: center;
		font-size: 34px;
		background-color: #636363;
	}

	div.navHead {
		background-color: $themeColor;
	}

	div.PageOne {
		padding: 30px 30px 0;

		div.imgCon {
			width: 100%;
			height: 690px;
			border-radius: 6px;
			border: 1px solid #e1e1e1;
			overflow: hidden;

			> img {
				width: 100%;
			}
		}

		div.Addph {
			margin-top: 30px;
			width: 100%;
			height: 87px;
			font-size: 34px;
			color: #fff;
			line-height: 87px;
			border-radius: 6px;
			background-color: #f9b758;
			text-align: center;
		}
	}

	div.pageTwo {
		padding: 30px 30px 0;

		p.describe {
			text-align: center;
			font-size: 30px;
			color: $themeColor;
		}

		> ul.photoList {
			width: 100%;
			min-height: 850px;
			@include clearfloat;

			> li {
				width: 320px;
				height: 225px;
				position: relative;
				border: 1px solid #e1e1e1;
				overflow: hidden;
				float: left;
				margin-top: 35px;
				margin-right: 45px;

				> img {
					width: 100%;
				}

				> div.deledtC {
					width: 60px;
					height: 60px;
					line-height: 60px;
					text-align: center;
					position: absolute;
					top: 0;
					right: 0;
					background-color: rgba(255,255,255,0.5);

					i {
						color: $themeColor;
						font-size: 40px;
					}
				}
			}

			> li:nth-child(2n) {
				margin-right: 0;
			}

			li.addP {
				color: $themeColor;
				text-align: center;
				padding-top: 40px;
				background-color: #f2f2f2;

				> i {
					font-size: 70px;
				}

				p {
					font-size: 30px;
				}
			}
		}
	}

	div.pageThree {
		width: 750px;

		div.linshiC {
			width: 100%;
			padding: 30px;

			p {
				font-size: 24px;
				color: #666;
			}

			select {
				width: 100%;
				height: 80px;
				border-radius: 8px;
				border: 1px solid #e1e1e1;
				font-size: 24px;
				padding-left: 10px;
				margin-top: 20px;
			}

			div.btn {
				width: 100%;
				height: 87px;
				text-align: center;
				line-height: 87px;
				font-size: 34px;
				color: #fff;
				background-color: #f9b758;
				margin-top: 20px;
				border-radius: 6px;
			}

			div.listCn {
				width: 100%;
				margin-top: 20px;
				overflow-x: auto;
				height: 270px;

				> ul {
					height: 100%;

					> li {
						width: 200px;
						height: 260px;
						position: relative;
						overflow: hidden;
						float: left;
						margin-right: 20px;

						img {
							width: 100%;
						}

						> div.deledtC {
							width: 40px;
							height: 40px;
							line-height: 40px;
							text-align: center;
							position: absolute;
							top: 0;
							right: 0;
							background-color: rgba(255,255,255,0.5);

							i {
								color: $themeColor;
								font-size: 30px;
							}
						}
					}

					li.addP {
						color: $themeColor;
						text-align: center;
						padding-top: 80px;
						background-color: #f2f2f2;

						> i {
							font-size: 50px;
						}

						p {
							font-size: 26px;
							color: $themeColor;
						}
					}
				}
			}
		}

		ul.workListS {
			width: 100%;

			> li {
				margin-top: 20px;
				background-color: #f2f2f2;
				padding: 0 30px;

				div.title {
					width: 100%;
					height: 90px;
					line-height: 90px;
					padding: 0 90px 0 20px;
					font-size: 28px;
					border-bottom: 1px solid #e1e1e1;
					position: relative;

					> div.deledtC {
						width: 90px;
						height: 90px;
						line-height: 90px;
						text-align: center;
						position: absolute;
						top: 0;
						right: 0;

						i {
							color: $themeColor;
							font-size: 40px;
						}
					}
				}

				div.listCon {
					width: 100%;
					overflow-x: auto;
					height: 210px;
					padding-top: 20px;
					padding-bottom: 20px;

					> ul {
						width: 100%;
						@include clearfloat;

						> li {
							width: 120px;
							height: 160px;
							overflow: hidden;
							float: left;
							margin-right: 20px;

							> img {
								width: 100%;
							}
						}
					}
				}
			}
		}
	}

	div.pageFour {
		width: 100%;
		position: relative;

		div.butCon {
			width: 100%;
			position: absolute;
			top: 720px;
			left: 0;
			padding: 0 30px;

			> a {
				display: block;
				width: 100%;
				height: 90px;
				border-radius: 8px;
				background-color: $themeColor;
				color: #fff;
				font-size: 34px;
				text-align: center;
				line-height: 90px;
				margin-top: 20px;
			}
		}
	}
}

section#testAunt {
	div.headInd,
	div.navHead {
		width: 100%;
		height: 100px;
		color: #fff;
		line-height: 100px;
		text-align: center;
		font-size: 34px;
		background-color: #636363;
	}

	div.navHead {
		background-color: $themeColor;
	}

	div.PageOne {
		min-height: 800px;

		div.Form {
			width: 520px;
			text-align: center;
			margin: 0 auto;
			padding-top: 85px;

			div.name {
				font-size: 34px;
				color: #666;
			}

			ul.navLabel {
				margin-top: 30px;
				width: 100%;
				height: 80px;
				@include clearfloat;

				> li {
					width: 50%;
					height: 100%;
					float: left;
					color: #999;
					font-size: 34px;
					line-height: 80px;
					background-color: #f2f2f2;
				}

				> li:nth-child(1) {
					border-radius: 10px 0 0 10px;
				}

				> li:nth-child(2) {
					border-radius: 0 10px 10px 0;
				}

				> li.active {
					background-color: $themeColor;
					color: #fff;
				}
			}

			select {
				width: 100%;
				height: 80px;
				border-radius: 10px;
				border: 1px solid #e1e1e1;
				text-align: center;
				margin-top: 30px;
				font-size: 30px;
				padding-left: 30px;
			}
		}
	}

	div.PageTwo {
		width: 100%;
		text-align: center;

		.header {
			width: 100%;
			font-size: 32px;
			color: #666;
			padding-top: 60px;
			padding-bottom: 40px;

			span {
				color: $themeColor;
			}
		}

		ul {
			width: 100%;
			padding: 0 45px 45px;

			> li {
				border-radius: 14px;
				background-color: #f2f2f2;
				padding: 0 32px;
				margin-top: 30px;

				div.title {
					width: 100%;
					font-size: 32px;
					color: $themeColor;
					line-height: 80px;
					border-bottom: 1px solid #fff;
				}

				p {
					font-size: 26px;
					color: #666;
					line-height: 68px;
				}
			}
		}
	}

	div.pageResult {
		width: 100%;
		position: relative;

		div.wordCon {
			position: absolute;
			bottom: 50px;
			left: 0;
			width: 100%;
			text-align: center;
			line-height: 60px;
			font-size: 34px;

			p {
				color: $themeColor;
				text-shadow: #fff 3px 0 0,#fff 0 3px 0,#fff -3px 0 0,#fff 0 -3px 0;
			}

			p.err {
				color: #666;
			}
		}
	}
}

div.pageTest {
	width: 100%;

	div.head {
		width: 100%;
		height: 100px;
		line-height: 100px;
		font-size: 36px;
		color: $themeColor;
		text-align: center;
		background-color: #f3f3f3;

		span.min {
			font-size: 28px;
		}
	}

	ul.topicList {
		width: 100%;

		> li {
			padding: 25px;
			background-color: #fff;

			div.timu {
				font-size: 32px;
				color: #666;

				span {
					color: $themeColor;
				}
			}
		}
	}

	ul.answerList {
		> li {
			width: 100%;
			height: 70px;
			border-bottom: 1px solid #e1e1e1;

			> input {
				display: none;
			}

			> label {
				display: block;
				width: 100%;
				line-height: 70px;
				font-size: 30px;
				color: #666;

				> span.ind {
					display: inline-block;
					width: 44px;
					height: 44px;
					border-radius: 50px;
					text-align: center;
					line-height: 44px;
					color: #fff;
					font-size: 24px;
					background-color: #0d0d0d;
					margin-right: 20px;
				}
			}

			> input:checked + label {
				color: $themeColor;

				> span.ind {
					background-color: $themeColor;
				}
			}
		}
	}
}

section.logoin {
	width: 100%;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	background-color: rgba(0,0,0,0.4);
	padding: 300px 25px 25px;

	div.form {
		background-color: #fff;
		border-radius: 14px;

		div.head {
			height: 100px;
			font-size: 32px;
			line-height: 100px;
			color: #fff;
			background-color: $themeColor;
			text-align: center;
			border-radius: 14px 14px 0 0;
		}

		> ul {
			padding: 30px 20px;

			> li {
				margin-top: 20px;
				height: 90px;
				position: relative;

				span.label {
					display: inline-block;
					height: 70px;
					width: 220px;
					font-size: 30px;
					margin: 0 20px;
					color: #666;
					border-radius: 35px;
					line-height: 70px;
					text-align: center;
					background-color: #f1f1f1;
					border: 1px solid #e1e1e1;
				}

				span.active {
					background-color: $themeColor;
					color: #fff;
				}

				> input {
					width: 100%;
					height: 100%;
					background-color: #f2f2f2;
					font-size: 28px;
					padding-left: 180px;
					border: none;
				}

				> button {
					width: 100%;
					height: 90px;
					border-radius: 14px;
					background-color: $themeColor;
					color: #fff;
					font-size: 28px;
					border: none;
				}

				div.name {
					width: 180px;
					height: 90px;
					line-height: 90px;
					position: absolute;
					top: 0;
					left: 0;
					color: #333;
					font-size: 28px;
					padding-left: 20px;
				}

				div.verificationBtn {
					position: absolute;
					top: 10px;
					right: 0;
					line-height: 70px;
					color: $themeColor;
					width: 210px;
					text-align: center;
					font-size: 28px;
					border-left: 1px solid #e1e1e1;
				}
			}
		}
	}
}
